<template>
  <!-- 头部搜索框 -->
  <div class="headNav">
    <van-icon
      name="arrow-left"
      size="25px"
      color="#656771"
      @click="$router.go(-1)"
    />
    <van-search v-model="value" class="inputBox"> </van-search>
    <van-icon
      name="ellipsis"
      size="25px"
      color="#656771"
      @click="showShare = true"
    />
    <share-page :showShare="showShare"></share-page>
  </div>
</template>

<script>
// 分享面板
import sharePage from "../common/sharePage.vue";
export default {
  data() {
    return {
      value: "",
      showShare: false, // 分享面板显示
    };
  },
  methods: {
    // 关闭分享面板
    isShow() {
      this.showShare = false;
    },
  },
  components: {
    sharePage,
  },
};
</script>

<style lang="scss" scoped>
.headNav {
  position: fixed;
  display: flex;
  align-items: center;
  justify-content: space-between;
  width: 100%;
  height: 55px;
  padding: 16px;
  box-sizing: border-box;
  background-color: #fff;
  z-index: 50;

  .inputBox {
    width: 289px;
    height: 33px;
    border-radius: 25px;
    padding: 5px 0;
    background-color: #f7f7f7;
    overflow: hidden;
  }
}
</style>
